<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
</head>
<body>
<header>
	<div class="container">
		<div class="row top-header">
			<div class="col-sm-3 text-left">
				<a href="#" class="logo">
					<img src="${pageContext.request.contextPath}/images/logo.png" alt="logo">
				</a>
			</div>				
			<div class="col-sm-9">
				<ul class="top-link pull-right">
					<li class="hidden-xs"><a href="">Wishlist</a></li>
					<li class="hidden-xs"><a href="#">Compare</a></li>
					<li class="hidden-xs"><a href="product_checkout.html">Checkout</a></li>
					<li class="dropdown hidden-xs">
						<a href="#" class="dropdown-toggle" data-toggle="dropdown" id="dropdownMenu1" aria-haspopup="true" aria-expanded="false">My Account <span class="caret"></span></a>
						<ul class="dropdown-menu" aria-labelledby="dropdownMenu1">
							<li><a href="login.jsp">Login</a></li>
							<li><a href="register.html">Register</a></li>
							<li><a href="#">Log out</a></li>
						</ul>
					</li>
						
					<!--style="position:fixed; top:50%; right: 0;"  -->
					<!-- 购物车页面由此开始-->
					<li id="header_of_shopping_cart" class="pull-right"  >
						<div id="shopping_cart_position" class="cart dropdown">						
							<a href="#" class="cart-item dropdown-toggle" id="dropdownMenu2" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
								<span>2</span><i class="fa fa-cart-plus"></i>
							</a>	
							<ul class="dropdown-menu" aria-labelledby="dropdownMenu2">
								
								<!-- 至此添加购物车条目信息 -->
								<div id="shopping_cart_list">
									
								</div>
								<!-- 至此结束购物车条目信息 -->								
								
								<li>
									<p>
										<a id="shopping_cart_checkout" href="${pageContext.request.contextPath}/orderInfo" class="btn ht-btn bg-3">Checkout</a>
										<a href="#" class="btn ht-btn bg-6">Cart</a>
									</p>
								</li>
								<!-- 由此结束购物车结算信息 -->
								
								
							</ul>
						</div>
					</li>
					
					<!-- 购物车页面至此结束 -->
					
					
				</ul>
			</div>
		</div>
	</div>
	<div class="container">
		<div class="bg-mn color-inher">
			<div class="row m-0">
			
				<!-- 下拉导航条 -->
				<div class="col-sm-1 col-md-1 col-lg-2 p-0">
					<div class="dropdown category-bar">
						<a href="#" class="dropdown-toggle"  role="button" aria-haspopup="true" aria-expanded="true">
							<i class="fa fa-bars"></i><span>Categories</span>
						</a>
					</div>
				</div>
				
				
				<div class="col-sm-8 col-md-8 col-lg-7 p-0">
					<div class="main-menu">
						<nav class="navbar navbar-default menu">
							<div class="navbar-header">
								<button type="button" class="navbar-toggle collapsed m-r-xs-15" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
									<span class="sr-only">Toggle navigation</span>
									<span class="icon-bar"></span>
									<span class="icon-bar"></span>
									<span class="icon-bar"></span>
								</button>
							</div>
							<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
								<ul class="nav navbar-nav"> 
									<li><a href="${pageContext.request.contextPath}/home">Home</a></li>
									<li><a href="about.html">About</a></li>
									<li><a href="login.jsp">Login</a></li>
									<li><a href="register.html">Register</a></li>
									<li><a href="#">Contact us</a></li>
								</ul>
							</div>
						</nav>
					</div>
				</div>	
				<div class="col-sm-3 col-md-3 col-lg-3 p-0">
					<div class="search-box m-l-xs-15 m-r-xs-15">
						<input type="text" class="form-item" placeholder="Search...">
						<button type="submit" class="fa fa-search"></button>
					</div>
				</div>
			</div>
		</div>
	</div>
</header>

</body>
</html>